//引入样式
require("../../assets/fonts/iconfont.css");
require("../../assets/css/normalize.css");
require("../../assets/css/reset.css");
require("../../assets/css/swiper-bundle.min.css");
require("../../assets/css/tabbar.less");
require("../../assets/css/sports.less");
require("../../assets/fontst/iconfont.css");
require("./sports_course.less");

//引入模块
const dom = require("../../utils/dom");
console.log(dom);
const axios = require("../../utils/axios");
// console.log(axios);
document.addEventListener("DOMContentLoaded", function () {
	//渲染tabbar
	dom.tabbar("sports");
	//渲染顶部nav
	dom.navbar("course");

	axios.get("/api/train/courseList").then((res) => {
		let data = res.data.data;
		let newCourse = data.shift();
		dom.get(".course-img").src = axios.defaults.baseURL + newCourse.imgurl;
		dom.get(".course h4").textContent = newCourse.name;
		dom.get(".course p").textContent = newCourse.desc.slice(0, 15) + "...";
		dom.get(".course").addEventListener("click", function () {
			location.href = "sports_course_detail.html?id=" + newCourse.courseId;
		});

		//下面课程渲染
		let html = `	`;
		data.forEach((v) => {
			html += `
			<div class="last">
					<a href="sports_course_detail.html?id=${v.courseId}">
						<img src="${axios.defaults.baseURL + v.imgurl}" />
						<h4>${v.name}</h4>
						<p>${v.desc.slice(0, 18)}</p>
					</a>
				</div>
			`;
		});
		dom.get(".last a").innerHTML = html;
	});
});
